.installer-noti {
    position: fixed;
    z-index: 99999;
    top: 20px;
    left: 50%;
    transform: translate(-50%, 0);
    display: flex;
    padding: 9px 12px;
    min-width: 320px;
    height: 33px;
    background: rgba(0, 211, 141, 0.1);
    border-radius: 2px;
    border: 1px solid rgba(0, 211, 141, 0.5);
    font-size: 12px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: rgba(0, 211, 141, 1);
    line-height: 12px;
    justify-content: space-between;

    &.error-noti {
        background: rgba(254, 105, 74, 0.1);
        border-color: rgba(254, 105, 74, 0.5);
        color: #FE694A;

        .installer-noti_left {
            i {
                background: url("../assets/error.png");
            }

            a {
                color: #047AFF;
            }
        }

        .installer-noti_right {
            a {
                color: rgba(0, 0, 0, 0.25);
            }
        }
    }

    .installer-noti_left, .installer-noti_right {
        display: flex;
        justify-content: flex-start;
    }

    .installer-noti_left {
        margin-right: 20px;

        i {
            margin-right: 8px;
            width: 14px;
            height: 14px;
            background: url("../assets/success.png");
        }

        div {
            span {
                display: inline-block;
                max-width: 520px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
        }
    }

    &.success-noti {
        .installer-noti_right {
            em {
                font-style: normal;
                font-weight: 400;
                color: rgba(0, 0, 0, 0.25);
                line-height: 12px;
            }

            a {
                margin-left: 5px;
                width: 12px;
                height: 12px;
                background: url("../assets/close.png");
            }
        }
    }

    a:hover {
        text-decoration: underline !important;
    }
}
